import React, { Component } from 'react'
import heros from '../../heros.json';
//querystring
import qs from 'querystring';

export default class Hero extends Component {
    render() {
        //输出 props 属性
        // console.log(this.props);
        //获取查询字符串
        let str = this.props.location.search.slice(1);
        //解析查询字符串
        let data = qs.parse(str);
        //获取url的id
        let id = data.id;
        //获取指定 id 的英雄信息 『实际情况会使用 AJAX 请求获取数据』
        //获取指定 id 的英雄对象
        let hero = heros.heroList.find(item =>  item.heroid === id );

        return (
            <div>
                <h3>英雄详情</h3>
                <h3>{hero.title.split('-').pop()}</h3>
                <img src={hero.heroimg} alt="" />
            </div>
        )
    }
}
